<template>
<div>
  <a-descriptions title="">
    <a-descriptions-item label="接口名称" :span="3">
      {{ apiName }}
    </a-descriptions-item>
    <a-descriptions-item label="请求方式" :span="3">
      {{ obj.apiMethod }}
    </a-descriptions-item>
    <a-descriptions-item label="请求地址" :span="3">
      {{ obj.apiUrl }}
    </a-descriptions-item>
    <a-descriptions-item label="serviceCode" :span="3">
      服务编码
    </a-descriptions-item>
  </a-descriptions>
  <a-table :columns="columns1" :data-source="data1" bordered :pagination="false">
    <template slot="title">
      请求数据：（body，json数据）
    </template>
  </a-table>
  <a-table :columns="columns1" :data-source="data2" bordered :pagination="false" style="margin-top:20px">
    <template slot="title">
      where和order条件：
    </template>
  </a-table>

  <div style="margin-top: 20px;font-size: 15px">请求示例</div>
  <JsonEditor v-model="bodyJson"  :readOnly="true" />
  <!-- 返回 -->
  <a-table :columns="columns2" :data-source="data3" bordered :pagination="false">
    <template slot="title" >
      响应数据：（json数据）
    </template>
  </a-table>
  <a-table :columns="columns2" :data-source="data4" bordered :pagination="false" style="margin-top:20px">
    <template slot="title">
      Result结构
    </template>
  </a-table>
  <a-table :columns="columns2" :data-source="data5" bordered :pagination="false">
    <template slot="title">
      Data结构
    </template>
  </a-table>
  <a-table :columns="columns2" :data-source="data6" bordered :pagination="false" style="margin-top:20px">
    <template slot="title">
      IndexUpdateInfo结构
    </template>
  </a-table>
  <div style="margin-top: 20px;font-size: 15px">返回示例</div>
  <JsonEditor v-model="resutJson"  :readOnly="true" />
  </div>
</template>

<script>
import JsonEditor from '@/components/JsonEditor.vue'
export default {
  name: 'InterfaceDetail1',
  components: {
    JsonEditor
  },
  props: {
    apiName: {
      type: String,
      default: ''
    },
    apiDesc: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      bodyJson: '{"pageNo":1,"pageSize": 10,"where": [{"column":"gdp","operator":">","value": "1"},{"column":"space","operator":"like","value": "渝%"}],"order": {"column":"gdp","operator":"order by","value":"asc"}}',
      resutJson: `{
          "success": true,
          "message": "操作成功！",
          "code": 200,
          "result": {
              "data": {
                  "total": 16,
                  "current": 1,
                  "size": 10,
                  "records": [
                      {
                          "gdp": "78164200",
                          "dw": "万元",
                          "nf": "2020",
                          "id": 1,
                          "region_code": "370600000000"
                      },
                      {
                          "gdp": "9848191 ",
                          "dw": "万元",
                          "nf": "2020",
                          "id": 2,
                          "region_code": "370602000000"
                      }
                  ]
              },
              "indexUpdateInfo": {
                  "indexName": null,
                  "indexId": null,
                  "sourceName": null,
                  "updateFrequency": null,
                  "lastUpdateTime": null
              },
              "labels": {
                  "gdp": "GDP",
                  "dw": "单位",
                  "nf": "年份",
                  "id": "主键",
                  "region_code": "区域编码"
              }
          },
          "timestamp": 1662367022218,
          "noDict": false
      }
      `,
      obj: {
        apiMethod: 'POST',
        apiUrl: 'http://{ip}{:port}{/context-path} /topic/data/listPageData/{serviceCode}'
      },
      columns1: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          customRender: function(t, r, index) {
            return parseInt(index) + 1
          }
        },
        {
          title: '字段',
          align: 'center',
          dataIndex: 'paramName'
        },
        {
          title: '字段描述',
          align: 'center',
          dataIndex: 'paramDesc'
        },
        {
          title: '类型',
          align: 'center',
          dataIndex: 'paramType'
        },
        {
          title: '必填',
          align: 'center',
          dataIndex: 'paramRequire'
        }
      ],
      data1: [
        { paramName: 'pageNo', paramDesc: '当前页', paramType: 'Integer', paramRequire: 'N' },
        { paramName: 'pageSize', paramDesc: '显示条数', paramType: 'Integer', paramRequire: 'N' },
        { paramName: 'where', paramDesc: 'where条件', paramType: 'JSONArray', paramRequire: 'N' },
        { paramName: 'order', paramDesc: 'order条件', paramType: 'JSON', paramRequire: 'N' }
      ],
      data2: [
        { paramName: 'column', paramDesc: '字段名', paramType: 'String', paramRequire: 'Y' },
        { paramName: 'operator', paramDesc: '操作符', paramType: 'String', paramRequire: 'Y' },
        { paramName: 'value', paramDesc: '属性值', paramType: 'String', paramRequire: 'Y' }
      ],
      columns2: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          customRender: function(t, r, index) {
            return parseInt(index) + 1
          }
        },
        {
          title: '字段',
          align: 'center',
          dataIndex: 'paramName'
        },
        {
          title: '字段类型',
          align: 'center',
          dataIndex: 'paramType'
        },
        {
          title: '描述',
          align: 'center',
          dataIndex: 'paramDesc'
        }
      ],
      data3: [
        { paramName: 'success', paramDesc: '是否成功', paramType: 'boolean' },
        { paramName: 'message', paramDesc: '消息描述', paramType: 'string' },
        { paramName: 'code', paramDesc: '返回码，200为成功，500为失败', paramType: 'string' },
        { paramName: 'result', paramDesc: '返回数据', paramType: 'Result' },
        { paramName: 'timestamp', paramDesc: '返回时间戳', paramType: 'long' }
      ],
      data4: [
        { paramName: 'data', paramDesc: '返回具体数据', paramType: 'Data' },
        { paramName: 'indexUpdateInfo', paramDesc: '当前接口最新更新数据', paramType: 'IndexUpdateInfo' },
        { paramName: 'labels', paramDesc: '返回字段标签信息，key为字段，value为字段说明', paramType: 'Map' }
      ],
      data5: [
        { paramName: 'records', paramDesc: '数据列表', paramType: 'list' },
        { paramName: 'total', paramDesc: '数据条数', paramType: 'int' },
        { paramName: 'current', paramDesc: '当前页', paramType: 'int' },
        { paramName: 'size', paramDesc: '分页大小', paramType: 'int' }
      ],
      data6: [
        { paramName: 'indexName', paramDesc: '指标名称', paramType: 'string' },
        { paramName: 'sourceName', paramDesc: '数据来源', paramType: 'string' },
        { paramName: 'updateFrequency', paramDesc: '更新频率', paramType: 'string' },
        { paramName: 'lastUpdateTime', paramDesc: '上次更新时间', paramType: 'string' }
      ]
    }
  }
}
</script>

<style>

</style>
